<script setup>
import {ref, watch} from "vue";
import {UploadFilled} from '@element-plus/icons-vue';
import {baseURL} from "@ut/tool.js";

let props = defineProps({show: Boolean, temp: String});
let emit = defineEmits(['submit', 'close']);
let show = ref(false);
let file = ref(null);

watch(() => props.show, async e => {
    show.value = e;
})

// 上传成功
function upSuccess({data}) {
    file.value = data;
}
</script>

<template>
    <el-dialog title="导入数据" v-model="show" width="500" @close="emit('close')" draggable>
        <el-upload drag :action="baseURL + '/file/up'" :data="{type: 'excel'}" :limit="1" accept=".xls, .xlsx" multiple :on-success="upSuccess">
            <el-icon class="el-icon--upload">
                <upload-filled />
            </el-icon>
            <div class="el-upload__text">拖拽或 <em>点击上传文件</em></div>
            <template #tip>
                <div class="el-upload__tip">
                    请上传 xlsx 文件，<el-link type="primary" :href="`${baseURL}/template/${props.temp}.xls`" target="_blank">下载模板</el-link>
                </div>
            </template>
        </el-upload>
        <template #footer>
            <el-button type="primary" @click="emit('submit', file)">确定</el-button>
            <el-button @click="emit('close')">取消</el-button>
        </template>
    </el-dialog>
</template>

<style scoped lang="less">

</style>